<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>管理收货地址</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/api.css"/>
    <link rel="stylesheet" type="text/css" href="__CSS__/aui.css"/>
    <style>
        .aui-iconfont {
            position: relative;
            font-family: "aui_iconfont" !important;
            font-size: 0.7rem;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            height: 2.4rem;
        }

        .aui-icon-tu {
            height: 2.4rem;
            width: 49px;
            background: url('__IMG__/left.png') no-repeat 0.5rem center;
            background-size: 10px 17.5px;
        }

        .aui-bar-nav .aui-pull-right {
            padding-right: 0.75rem;
        }

        .aui-bar-nav .aui-iconfont {
            font-size: 14px;
            color: #555;
        }

        .search {
            height: 2.2rem;
            background-color: #fff;
            padding-left: 12px;
            padding-right: 10px;
        }

        .pposition {
            min-height: 2.4rem;
            margin: 0;
            text-align: center;
            white-space: nowrap;
            left: 0.75rem;
            overflow: hidden;
            text-overflow: ellipsis;
            z-index: 2;
        }

        .pposition_left {
            float: left;
            width: 0.675rem;
            height: 0.8rem;
            margin-top: 6px;
        }

        .eara {
            float: left;
            color: #555555;
            font-size: 13px;
            padding-top: 5.5px;
            padding-left: 6.5px;
            padding-right: 7.5px;
        }

        .pposition_right {
            float: left;
            width: 7px;
            height: 4px;
            margin-top: 12px;
        }

        .aui-searchbar {
            display: -webkit-box;
            -webkit-box-pack: center;
            -webkit-box-align: center;
            height: 2.1rem;
            overflow: hidden;
            background-color: #ffffff;
            color: #555;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            margin-left: 6px;
        }

        .aui-searchbar-input {
            background-color: #F5F7F8;
            border-radius: 0.65rem;
            height: 29px;
            line-height: 29px;
            font-size: 0.7rem;
            position: relative;
            display: -webkit-box;
            -webkit-box-flex: 1;
            margin: 0;
            margin-bottom: 0.75rem;
        }

        .aaa {
            height: 29px;
            line-height: 29px;
            font-size: 13px;
            color: #999999 !important;
            display: inline-block;
            vertical-align: top;
            margin-top: 1px;
        }

        .aui-icon-search:before {
            content: '';
            width: 0.9rem;
            height: 29px;
            background: url('__IMG__/search1.png') no-repeat center center;
            background-size: 0.9rem 0.925rem;
            display: inline-block;
        }

        body, html, #container {
            width: 100%;
            height: 8.5rem;
            margin: 0px
        }

    </style>
    <style>
        body {
            background-color: #fff;
            outline: 0;
        }

        .map {
            height: 10.5em;
            background-color: #F4F4F4;
        }

        .all {
            padding-left: 0.5rem;
            padding-right: 0.5rem;
        }

        .local {
            width: 0.625rem;
            height: 0.85rem;
            margin-top: 0.9rem;
            margin-right: 0.6rem;
        }

        .addr {
            padding-top: 5px;
        }

        .address {
            padding-top: 0.55rem;
            padding-bottom: 0.55rem;
            font-size: 14px;
            color: #999;
        }

        .dizhi {
            font-size: 14px;
            color: #555555;
            padding-top: 0.7rem;
            padding-bottom: 0.25rem;
            font-weight: bold;
        }

        .now {
            font-size: 15px;
            color: #F04040;
        }

        .rest {
            font-size: 15px;
            color: #404040;
        }
    </style>
    <style>
        .aui-icon-rightu{
            height: 2.35rem;
            width: 40px;
            background: url('__IMG__/search.png') no-repeat center center;
            background-size: 18px 18.5px;
        }
    </style>
</head>

<body>
<div id="aaaaaa">
<header class="aui-bar aui-bar-nav" id="header">
    <a class="aui-pull-left" tapmode="active" onclick="window.history.back(-1);"> <span
            class="aui-iconfont aui-icon-tu"> </span> </a>
    <div class="aui-title">新增收货地址</div>
</header>
<div class="search flex-wrap underLine" id="search_bar">
    <div class="pposition" tapmode="active">
        <img class='pposition_left' src="__IMG__/local1.png" alt="">
        <span class="eara" id="titleee"></span>
        <img class='pposition_right' src="__IMG__/down.png" alt="">
    </div>
    <div class="flex-con aui-searchbar" id="search">
        <div class="aui-searchbar-input aui-border-radius">
            <div>
                <span class="aui-iconfont aui-icon-search"></span>
                <span class="aaa">请输入您的收货地址</span>
            </div>
        </div>
    </div>
</div>
<div id="container" tabindex="0"></div>
<div id="xunhaun">

</div>
</div>
<!---->
<!---->
<!---->
<div id="gaode" style="display: none">
    <div class="aui-bar aui-bar-nav underLine">
        <a class="aui-pull-left" tapmode="active" onclick="search222();"> <span class="aui-iconfont aui-icon-tu"> </span> </a>
        <div class="aui-title">
            <div class="aui-searchbar">
                <input class="keyword" type="search" placeholder="输入关键字" style="background-color: #f5f7f8;width: 100%;height: 27px;line-height: 27px;padding-top: 10px;margin-top: 7px" />
                <div class="cha hidden" tapmode="active" onclick="cha()"></div>
            </div>
        </div>
        <a class="aui-pull-right" style="position:relative;">
            <!-- 搜索 -->
            <span class="aui-iconfont aui-icon-rightu" id="sou" tapmode="active" onclick="search()"></span>
            <!-- 搜索结果 -->
            <span class="aui-iconfont aui-icon-rightu1 hidden" id="car" tapmode="active" onclick="right()"></span>
            <span class="num hidden"></span>
        </a>

    </div>
    <div id="xunhaun2">

    </div>
</div>
<!---->
<!---->
<!---->
</body>
<input type="hidden" id="lat" value="{$data.lat}"/>
<input type="hidden" id="lon" value="{$data.lon}"/>
<input type="hidden" id="name" value="{$data.name}"/>
<input type="hidden" id="phone" value="{$data.phone}"/>
<input type="hidden" id="address" value="{$data.address}"/>
<input type="hidden" id="door" value="{$data.door}"/>
<input type="radio" name="radio" checked value="{$data.sex}" style="display: none;" />
<!--搜索时的区显示-->
<input type="hidden" id="qu" value=""/>
<script type="text/javascript" src="__JS__/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/tt222.js"></script>
<script type="text/javascript"
        src="https://webapi.amap.com/maps?v=1.4.10&key=3108d268226b46915b5faa028a004245&plugin=AMap.Geocoder"></script>
<script type="text/javascript">
    var map = new AMap.Map('container', {
        resizeEnable: true
    });

    AMap.plugin('AMap.Geolocation', function () {
        var geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位，默认:true
            timeout: 10000,          //超过10秒后停止定位，默认：5s
            buttonPosition: 'RB',    //定位按钮的停靠位置
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
            zoomToAccuracy: true,
            extensions: 'all'

        });
        geolocation.getCurrentPosition(function (status, result) {
            if (status == 'complete') {
                onComplete(result)
            } else {
                onError(result)
            }
        });
    });
    function onComplete(data) {
        $('#titleee').text(data.addressComponent.city);
        $('#qu').val(data.addressComponent.district);
        var datas = data.pois;
        $('#xunhaun').empty();
        $.each(datas, function (key, v) {
            $('#xunhaun').append('' +
                '<div class="all flex-wrap" address="' + data.addressComponent.city + data.addressComponent.district + v.address + v.name + '" lat="' + v.location.lat + '" lon="' + v.location.lng + '" onclick="chooseOne(this)">' +
                '<div class="local"><img src="__IMG__/local3.png"></div>' +
                '<div class="addr flex-con">' +
                '<div class="address underLine">' +
                '<div class="now">' + v.name + '</div>' +
                '<div>' + v.address + '</div>' +
                '</div></div></div>');
        });
    }
    function onError(data) {
        alert(data.message)
    }

    function chooseOne(el) {
        var lat = $(el).attr('lat');
        var lon = $(el).attr('lon');
        var address = $(el).attr('address');
        $('#lat').val(lat);
        $('#lon').val(lon);
        $('#address').val(address);
        var str = getAddAddress2Param(2);
        var lat2 = {$lat};
        var lon2 = {$lon};
        var sid = {$shopid};
        location.href = '{:url("Car/addAdd")}?' + str+'&lat2='+lat2+'&lon2='+lon2+'&shopid='+sid;
    }
    //------------------------------------------------------------------------------
    $('#search').click(function () {
        $('#aaaaaa').css('display','none')
        $('#gaode').css('display','block')
    });
    function search222() {
        $('#aaaaaa').css('display','block')
        $('#gaode').css('display','none')
    }
    //------------------------------------------------------------------------------
    // 获取搜索信息
    function search() {
        var city = $('#titleee').text();
        var qu = $('#qu').val();
        var keywords = $('.keyword').val().trim();
        if(keywords == ''){
            alert('不能为空');
            return;
        }else{
            AMap.plugin('AMap.PlaceSearch', function () {
                var autoOptions = {
                    city: city,
                    citylimit:true,
                    pageSize:20
                }
                var placeSearch = new AMap.PlaceSearch(autoOptions);
                placeSearch.search(keywords, function (status, result) {
                    // 搜索成功时，result即是对应的匹配数据
                    var datas = result.poiList.pois;
                    $('#xunhaun2').empty();
                    $.each(datas, function (key, v) {
                        $('#xunhaun2').append('' +
                            '<div class="all flex-wrap" address="' + city + qu + v.address + v.name + '" lat="' + v.location.lat + '" lon="' + v.location.lng + '" onclick="chooseOne(this)">' +
                            '<div class="local"><img src="__IMG__/local3.png"></div>' +
                            '<div class="addr flex-con">' +
                            '<div class="address underLine">' +
                            '<div class="now">' + v.name + '</div>' +
                            '<div>' + v.address + '</div>' +
                            '</div></div></div>');
                    });
                })
            })
        }

    }
    document.onkeydown = function (event) {
        var e = event || window.event || arguments.callee.caller.arguments[0];
        if (e && e.keyCode == 13) { // enter 键
            //你的操作
            search();
        }
    };
</script>

</html>
